$(function() {
		//下方for循环
		var size = $(".img li").size()
		for (var i = 1; i <= size; i++) {
			var li = "<li>" + i + "</li>";
			$(".num").append(li)
		}
		/*size  获取当前元素个数*/

		//手动控制轮播
		$(".img li").eq(0).show()
		$(".num li").eq(0).addClass('active-1')
		/*mouseover  可以改成点击事件  click*/
		$(".num li").mouseover(
				function() {
					$(this).addClass('active-1').siblings('li').removeClass(
							'active-1')
					var index = $(this).index() /*index  当前元素的意思索引值*/
					i = index; //i值和自动轮播值是相同的
					$(".img li").eq(index).stop().fadeIn(/*淡入*/).siblings()
							.stop().fadeOut(/*淡出*/) /*eq 0开始*/
				});

		//自动控制轮播
		var i = 0;
		var t = setInterval(move,2000) //定时器
		//右
		function move() {
			i++;
			if (i == size) {
				i = 0;
			}
			$(".num li").eq(i).addClass('active-1').siblings('li').removeClass(
					'active-1');
			$(".img li").eq(i).fadeIn().siblings().fadeOut();
		}
		;
		//左
		function moveL() {
			i--;
			if (i == -1) {
				i = size - 1;
			}
			$(".num li").eq(i).addClass('active-1').siblings('li').removeClass(
					'active-1');
			$(".img li").eq(i).fadeIn().siblings().fadeOut();
		}
		;
		//自动轮播鼠标经过移入和移除
		$(".out").hover(function() {
			clearInterval(t)
		}, function() {
			t = setInterval(move, 5000)
		});

		//左右按钮
		$(".out .left").click(function() {
			moveL()
		});
		$(".out .right").click(function() {
			move()
		});

		$("#t7").mouseenter(function() {
			$("#t9").css("visibility", "visible");
		});
		$("#t7").mouseleave(function() {
			$("#t9").css("visibility", "hidden");
		});

		$(".t8").mouseenter(function() {
			$(".t8 .sp").css("visibility", "hidden");
			$("#t9 #tp1").css("visibility", "visible");
		});
		$(".t8").mouseleave(function() {
			$(".t8 .sp").css("visibility", "visible");
			$("#t9 #tp1").css("visibility", "hidden");
		});

		$(".t9").mouseenter(function() {
			$(".t9 .sp").css("visibility", "hidden");
			$("#t9 #tp2").css("visibility", "visible");
		});
		$(".t9").mouseleave(function() {
			$(".t9 .sp").css("visibility", "visible");
			$("#t9 #tp2").css("visibility", "hidden");
		});

		$(".t10").mouseenter(function() {
			$(".t10 .sp").css("visibility", "hidden");
			$("#t9 #tp3").css("visibility", "visible");
		});
		$(".t10").mouseleave(function() {
			$(".t10 .sp").css("visibility", "visible");
			$("#t9 #tp3").css("visibility", "hidden");
		});

		$(".t11").mouseenter(function() {
			$(".t11 .sp").css("visibility", "hidden");
			$("#t9 #tp4").css("visibility", "visible");
		});
		$(".t11").mouseleave(function() {
			$(".t11 .sp").css("visibility", "visible");
			$("#t9 #tp4").css("visibility", "hidden");
		});

		$("#d3").mouseenter(function() {
			$(".t8 .sp").css("visibility", "hidden");
			$("#t9 #tp1").css("visibility", "visible");
		});
		$("#d3").mouseleave(function() {
			$(".t8 .sp").css("visibility", "visible");
			$("#t9 #tp1").css("visibility", "hidden");
		});

		$("#d4").mouseenter(function() {
			$(".t9 .sp").css("visibility", "hidden");
			$("#t9 #tp2").css("visibility", "visible");
		});
		$("#d4").mouseleave(function() {
			$(".t9 .sp").css("visibility", "visible");
			$("#t9 #tp2").css("visibility", "hidden");
		});

		$("#d5").mouseenter(function() {
			$(".t10 .sp").css("visibility", "hidden");
			$("#t9 #tp3").css("visibility", "visible");
		});
		$("#d5").mouseleave(function() {
			$(".t10 .sp").css("visibility", "visible");
			$("#t9 #tp3").css("visibility", "hidden");
		});

		$("#d6").mouseenter(function() {
			$(".t11 .sp").css("visibility", "hidden");
			$("#t9 #tp4").css("visibility", "visible");
		});
		$("#d6").mouseleave(function() {
			$(".t11 .sp").css("visibility", "visible");
			$("#t9 #tp4").css("visibility", "hidden");
		});
		$(".c1").mouseenter(function() {
			$("#b3").css("visibility", "visible");
			$(".tp1").css("visibility", "visible");
			
			$("#b4").css("visibility", "hidden");
			$(".tp2").css("visibility", "hidden");
			
			$("#b5").css("visibility", "hidden");
			$(".tp3").css("visibility", "hidden");
			
			$("#b6").css("visibility", "hidden");
			$(".tp4").css("visibility", "hidden");
		});
		
		$(".c2").mouseenter(function() {
			$("#b4").css("visibility", "visible");
			$(".tp2").css("visibility", "visible");
			
			$("#b3").css("visibility", "hidden");
			$(".tp1").css("visibility", "hidden");
			
			$("#b5").css("visibility", "hidden");
			$(".tp3").css("visibility", "hidden");
			
			$("#b6").css("visibility", "hidden");
			$(".tp4").css("visibility", "hidden");
		});
		
		$(".c3").mouseenter(function() {
			$("#b4").css("visibility", "hidden");
			$(".tp2").css("visibility", "hidden");
			
			$("#b3").css("visibility", "hidden");
			$(".tp1").css("visibility", "hidden");
			
			$("#b5").css("visibility", "visible");
			$(".tp3").css("visibility", "visible");
			
			$("#b6").css("visibility", "hidden");
			$(".tp4").css("visibility", "hidden");
		});
		
		$(".c4").mouseenter(function() {
			$("#b4").css("visibility", "hidden");
			$(".tp2").css("visibility", "hidden");
			
			$("#b3").css("visibility", "hidden");
			$(".tp1").css("visibility", "hidden");
			
			$("#b5").css("visibility", "hidden");
			$(".tp3").css("visibility", "hidden");
			
			$("#b6").css("visibility", "visible");
			$(".tp4").css("visibility", "visible");
		});
		$("#p1").mouseenter(function(){
			$("#p1").css("width","80%").css("height","90%");
		});
		$("#p1").mouseleave(function(){
			$("#p1").css("width","70%").css("height","80%");
		});
		
		$("#p2").mouseenter(function(){
			$("#p2").css("width","80%").css("height","90%");
		});
		$("#p2").mouseleave(function(){
			$("#p2").css("width","70%").css("height","80%");
		});
		
		$("#p4").mouseenter(function(){
			$("#p4").css("width","80%").css("height","90%");
		});
		$("#p4").mouseleave(function(){
			$("#p4").css("width","70%").css("height","80%");
		});
		
		$("#p3").mouseenter(function(){
			$("#p3").css("width","80%").css("height","90%");
		});
		$("#p3").mouseleave(function(){
			$("#p3").css("width","70%").css("height","80%");
		});
		
		$("#p5").mouseenter(function(){
			$("#p5").css("width","80%").css("height","90%");
		});
		$("#p5").mouseleave(function(){
			$("#p5").css("width","70%").css("height","80%");
		});
		
		$("#p6").mouseenter(function(){
			$("#p6").css("width","80%").css("height","90%");
		});
		$("#p6").mouseleave(function(){
			$("#p6").css("width","70%").css("height","80%");
		});
		
		$("#p7").mouseenter(function(){
			$("#p7").css("width","80%").css("height","90%");
		});
		$("#p7").mouseleave(function(){
			$("#p7").css("width","70%").css("height","80%");
		});
		
		$("#p8").mouseenter(function(){
			$("#p8").css("width","80%").css("height","90%");
		});
		$("#p8").mouseleave(function(){
			$("#p8").css("width","70%").css("height","80%");
		});
		
		
		$("#p9").mouseenter(function(){
			$("#p9").css("width","80%").css("height","90%");
		});
		$("#p9").mouseleave(function(){
			$("#p9").css("width","70%").css("height","80%");
		});
		
		$("#p10").mouseenter(function(){
			$("#p10").css("width","80%").css("height","90%");
		});
		$("#p10").mouseleave(function(){
			$("#p10").css("width","70%").css("height","80%");
		});
		
		$("#p11").mouseenter(function(){
			$("#p11").css("width","80%").css("height","90%");
		});
		$("#p11").mouseleave(function(){
			$("#p11").css("width","70%").css("height","80%");
		});
		
		$("#p12").mouseenter(function(){
			$("#p12").css("width","80%").css("height","90%");
		});
		$("#p12").mouseleave(function(){
			$("#p12").css("width","70%").css("height","80%");
		});
		
		$("#p13").mouseenter(function(){
			$("#p13").css("width","80%").css("height","90%");
		});
		$("#p13").mouseleave(function(){
			$("#p13").css("width","70%").css("height","80%");
		});
		
		$("#p14").mouseenter(function(){
			$("#p14").css("width","80%").css("height","90%");
		});
		$("#p14").mouseleave(function(){
			$("#p14").css("width","70%").css("height","80%");
		});
		
		$("#p15").mouseenter(function(){
			$("#p15").css("width","80%").css("height","90%");
		});
		$("#p15").mouseleave(function(){
			$("#p15").css("width","70%").css("height","80%");
		});
		
		
		
		$("#p16").mouseenter(function(){
			$("#p16").css("width","80%").css("height","90%");
		});
		$("#p16").mouseleave(function(){
			$("#p16").css("width","70%").css("height","80%");
		});

		
		$(".p1").click(function(){
			$("#f3").css("visibility","visible");
			$("#f4").css("visibility","hidden");
			$("#f5").css("visibility","hidden");
			$("#f6").css("visibility","hidden");
			$("#f7").css("visibility","hidden");
			$("#f8").css("visibility","hidden");
		});
		
		$(".p2").click(function(){
			$("#f4").css("visibility","visible");
			$("#f3").css("visibility","hidden");
			$("#f5").css("visibility","hidden");
			$("#f6").css("visibility","hidden");
			$("#f7").css("visibility","hidden");
			$("#f8").css("visibility","hidden");
		});
		
		$(".p3").click(function(){
			$("#f5").css("visibility","visible");
			$("#f3").css("visibility","hidden");
			$("#f4").css("visibility","hidden");
			$("#f6").css("visibility","hidden");
			$("#f7").css("visibility","hidden");
			$("#f8").css("visibility","hidden");
		});
		
		$(".p4").click(function(){
			$("#f6").css("visibility","visible");
			$("#f3").css("visibility","hidden");
			$("#f4").css("visibility","hidden");
			$("#f5").css("visibility","hidden");
			$("#f7").css("visibility","hidden");
			$("#f8").css("visibility","hidden");
		});
		
		$(".p5").click(function(){
			$("#f7").css("visibility","visible");
			$("#f3").css("visibility","hidden");
			$("#f4").css("visibility","hidden");
			$("#f5").css("visibility","hidden");
			$("#f6").css("visibility","hidden");
			$("#f8").css("visibility","hidden");
		});
		
		$(".p6").click(function(){
			$("#f8").css("visibility","visible");
			$("#f3").css("visibility","hidden");
			$("#f4").css("visibility","hidden");
			$("#f5").css("visibility","hidden");
			$("#f6").css("visibility","hidden");
			$("#f7").css("visibility","hidden");
		});
		
		$(".o1").mouseenter(function(){
			$(".o1").css("width","370px").css("height","380px");
		});
		$(".o1").mouseleave(function(){
			$(".o1").css("width","360px").css("height","370px");
		});
		
		$(".o2").mouseenter(function(){
			$(".o2").css("width","110%").css("height","110%");
		});
		$(".o2").mouseleave(function(){
			$(".o2").css("width","100%").css("height","100%");
		});
		
		$(".o3").mouseenter(function(){
			$(".o3").css("width","110%").css("height","110%");
		});
		$(".o3").mouseleave(function(){
			$(".o3").css("width","100%").css("height","100%");
		});
		
		$("#o4").mouseenter(function(){
			$("#o4").css("width","110%").css("height","110%");
		});
		$("#o4").mouseleave(function(){
			$("#o4").css("width","100%").css("height","100%");
		});
		
		$("#o5").mouseenter(function(){
			$("#o5").css("width","110%").css("height","110%");
		});
		$("#o5").mouseleave(function(){
			$("#o5").css("width","100%").css("height","100%");
		});
		

		$(document).scroll(function() {
				if($(document).scrollTop() >= 500) {
					$("#menu").fadeIn(500);
				var i = Math.floor(($(document).scrollTop() - 500) / 700);
				$("ul li").eq(i).children("span").addClass("active");
				$("ul li").eq(i).siblings().children("span").removeClass("active")
				}else{
					$("#menu").fadeOut(333);
				}
			});		
		
		$("ul li").not(".last").click(function() {
				$("body,html").animate({ "scrollTop": $(this).index() * 380 + 250 }, 666)
		})
		$(".last").click(function(){
				$("body").animate({ "scrollTop":0 },500);
			});
		
		$("#q1").mouseenter(function(){
			$("#q1").css("background","RGB(235,83,69)");
			$("#q2").css("background","#444");
			$("#q3").css("background","#444");
			$("#q4").css("background","#444");
			
			$("#bj1").css("visibility","visible");
			$("#bj2").css("visibility","hidden");
			$("#bj3").css("visibility","hidden");
			$("#bj4").css("visibility","hidden");
			
			$("#div1").css("visibility","visible");
			$("#div2").css("visibility","hidden");
			$("#div3").css("visibility","hidden");
			$("#div4").css("visibility","hidden");
		});

		$("#q2").mouseenter(function(){
			$("#q2").css("background","RGB(235,83,69)");
			$("#q1").css("background","#444");
			$("#q3").css("background","#444");
			$("#q4").css("background","#444");
			
			$("#bj2").css("visibility","visible");
			$("#bj1").css("visibility","hidden");
			$("#bj3").css("visibility","hidden");
			$("#bj4").css("visibility","hidden");
			
			$("#div2").css("visibility","visible");
			$("#div1").css("visibility","hidden");
			$("#div3").css("visibility","hidden");
			$("#div4").css("visibility","hidden");
		});

		$("#q3").mouseenter(function(){
			$("#q3").css("background","RGB(235,83,69)");
			$("#q2").css("background","#444");
			$("#q1").css("background","#444");
			$("#q4").css("background","#444");
			
			$("#bj3").css("visibility","visible");
			$("#bj2").css("visibility","hidden");
			$("#bj1").css("visibility","hidden");
			$("#bj4").css("visibility","hidden");
			
			$("#div3").css("visibility","visible");
			$("#div2").css("visibility","hidden");
			$("#div1").css("visibility","hidden");
			$("#div4").css("visibility","hidden");
		});
		
		$("#q4").mouseenter(function(){
			$("#q4").css("background","RGB(235,83,69)");
			$("#q2").css("background","#444");
			$("#q3").css("background","#444");
			$("#q1").css("background","#444");
			
			$("#bj4").css("visibility","visible");
			$("#bj2").css("visibility","hidden");
			$("#bj3").css("visibility","hidden");
			$("#bj1").css("visibility","hidden");
			
			$("#div4").css("visibility","visible");
			$("#div2").css("visibility","hidden");
			$("#div3").css("visibility","hidden");
			$("#div1").css("visibility","hidden");
		});

	});